<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link href="../CSS/home.css" rel="stylesheet" />
		<script src="../JS/jquery-3.5.0.min.js"></script>
	</head>
	<body>
		<div class="home">
			<img class="home-loaction" src="../IMG/loaction.png" />
			<p class="home-title">智汇家园</p>
			<img class="home-down" src="../IMG/down.png" />
			<div class="home-search">
				<span class="home-search-span">搜索饿了么商家、商品名称</span>
			</div>
			<!-- 顶部导航按钮区域 -->
			<div class="main">
				<!-- 做数据拼接 -->
			</div>
			<!-- 会员区域 -->
			<div class="vip">
				<div class="vip-food">
					<p class="vip-food-title">品质套餐</p>
					<p class="vip-food-memo">搭配齐全吃得好</p>
					<p class="vip-food-btn">立即抢购 ></p>
					<img src="../IMG/food.jpg" />
				</div>
				<div class="vip-packet">
					<img src="../IMG/vip.jpg" />
					<span class="vip-packet-svip">超级会员</span>
					<span class="vip-packet-memo"> · 2个无门槛红包未领取</span>
					<a class="vip-packet-receive">领取专属红包 ></a>
				</div>
			</div>
			<!-- 推荐商家 -->
			<div class="recommend">推荐商家</div>
			<!-- 排序操作按钮 -->
			<div class="sort">
				<ul class="sort-ul">
					<li class="sort-ul-down">综合排序</li>
					<li>距离最近</li>
					<li>销量最高</li>
					<li class="sort-ul-sort">筛选</li>
				</ul>
			</div>
			<!-- 商家列表 -->
			<div class="store">
				<!-- 卡片列表 -->
				<!-- 此处做数据动态拼接 -->
			</div>
			<!-- 底部导航 -->
			<div class="tabbar">
				<div class="tabbar-item">
					<img src="../IMG/eleme.svg" />
					<p style="color: #0085FF;">首页</p>
				</div>
				<div class="tabbar-item">
					<img src="../IMG/compass.svg" />
					<p>发现</p>
				</div>
				<div class="tabbar-item">
					<img src="../IMG/order.svg" />
					<p>订单</p>
				</div>
				<div class="tabbar-item">
					<img src="../IMG/user.svg" />
					<p>我的</p>
				</div>
			</div>
			<!-- 置顶按钮 -->
			<div class="toTop">

			</div>
		</div>
	</body>
	<script src="../JS/resize.js"></script>
	<script src="../JS/home.js"></script>
</html>
